/* eslint-disable */
/**
 * Created by GYL on 2018/8/24
 */
//事件模板管理
import React, { Component } from 'react';
import MyTable from "../../../components/common/MyTable";
import PublicService from "../../../services/PublicService";
import MyModal from '../../../components/common/MyModal';
import request from '../../../utils/request';
import styles from './Tab1_sub.less';
import { Tabs, Form, Input, Descriptions, Icon, List, Button, DatePicker, message, Spin } from 'antd';
import moment from 'moment';
import SubeventsInfo from './SubeventsInfo';
import PublicTemplate from '../../../services/PublicTemplate';
const { TextArea } = Input;
const IconFont = Icon.createFromIconfontCN({
  scriptUrl: '//at.alicdn.com/t/font_1315525_8t7dqol1zvn.js',
});

class Tab5_sub extends Component {

  state = {
    approvalNumber: '',
    projectName: '',
    eventName: '',
    processHistoryList: [],
    eventAuditUserList: [],
    remark: '',
    dataSate: [],
    taskClassify: '',
    content: '',
    subeventsInfo: {},
    fileList: [],
    tabData: {},
    planStartTime: '',
    planEndTime: '',
    SubeventsInfoData: [],
    yqly: '',
    sjkssj: null,
    dataStr: '',
    system: {},
    loading: false
  }

  componentDidMount() {
    this.getProcessTaskParticulars()
  }

  //查询审批详情
  getProcessTaskParticulars = () => {
    request({
      url: '/pm-web/process/task/getSystemToRemindParticulars',
      method: 'POST',
      data: { id: this.props.taskId, userId: PublicService.getCookie('userId') }
    }).then(data => {
      // console.log(data)
      if (data.rc === 0) {
        if (data.ret.system.remindType == 3 || data.ret.system.remindType == 4) {
          this.setState({
            projectName: data.ret.system.projectName,
            eventName: data.ret.system.eventName,
            planStartTime: data.ret.event.planStartTime,
            planEndTime: data.ret.event.planEndTime,
            actualStartTime: data.ret.event.actualStartTime,
            actualEndTime: data.ret.event.actualEndTime,
            workTime: data.ret.event.workTime,
            practicalWorkTime: data.ret.event.practicalWorkTime,
            SubeventsInfoData: data.ret.event,
            system: data.ret.system

          })
        } else {
          this.setState({
            projectName: data.ret.system.projectName,
            eventName: data.ret.system.eventName,
            planStartTime: data.ret.event.planStartTime,
            planEndTime: data.ret.event.planEndTime,
            actualStartTime: false,
            actualEndTime: false,
            workTime: data.ret.event.workTime,
            practicalWorkTime: data.ret.event.practicalWorkTime,
            SubeventsInfoData: data.ret.event,
            system: data.ret.system

          })
        }

      }
    })
  }

  onTextArea = (value, v) => {
    // console.log(value, v)
    this.setState({
      [value]: v.target.value
    })
  }

  onsubeventsInfo = () => {
    this.setState({
      SubeventsInfoVisible: true
    })

  }

  // 取消保存
  ModalCancel = (type) => {
    let t = this;
    t.setState({
      [type]: false,
      modalBtnLoading: false
    })
  };

  getYqly = (record) => {
    return (
      <Descriptions.Item label="逾期理由" span={24}>{this.state.system.haveRead == 1 ? PublicTemplate.stringToEllipsis(record.startDelay,25) || '无' : this.getYqlyInput()}</Descriptions.Item>
    )
  }

  getYqlyInput = () => {
    const { yqly } = this.state
    return (
      <TextArea rows={4} value={yqly} onChange={(v) => { if(v.target.value.length < 250) this.setState({ yqly: v.target.value }) }} />
    )
  }

  getSjkssj = (record) => {
    return (
      <Descriptions.Item label="实际开始时间" span={24}>{record.actualStartTime || this.getSjkssjInput()}</Descriptions.Item>
    )
  }

  onChangeDay = (data, dataStr) => {
    console.log(data)
    this.setState({
      sjkssj: data,
      dataStr
    })
  }

  getSjkssjInput = () => {
    const { sjkssj } = this.state
    return (
      <DatePicker onChange={this.onChangeDay} value={sjkssj} />
    )
  }

  onSave = () => {
    const { sjkssj, dataStr, yqly } = this.state

    if (sjkssj) {
      let jihua = moment(this.state.planStartTime).unix()
      // console.log(sjkssj)
      let shiji = moment(dataStr).unix()


      if (moment(shiji) > moment(jihua)) {
        if (yqly) {
          // console.log(dataStr)
          this.setState({
            loading: true
          })
          request({
            url: '/pm-web/process/task/setTheActualStartTime',
            method: 'POST',
            data: { id: this.props.taskId, userId: PublicService.getCookie('userId'), actualStartTime: dataStr, startDelay: yqly }
          }).then(data => {
            this.setState({
              loading: false
            })
            if (data.rc === 0) {
              message.success('操作成功!')
              this.props.onClose()
            } else {
              message.warning(data.err)
            }
          })

        } else {
          message.warning('实际开始时间逾期了,请填写逾期理由后保存!')
        }
      } else {
        this.setState({
          loading: true
        })
        request({
          url: '/pm-web/process/task/setTheActualStartTime',
          method: 'POST',
          data: { id: this.props.taskId, userId: PublicService.getCookie('userId'), actualStartTime: dataStr, startDelay: yqly }
        }).then(data => {
          this.setState({
            loading: false
          })
          if (data.rc === 0) {
            message.success('操作成功!')
            this.props.onClose()
          } else {
            message.warning(data.err)
          }
        })
      }
    } else {
      message.warning('请选择实际开始时间!')
    }

  }
  render() {
    let t = this
    const { system, SubeventsInfoData } = this.state
    return (
      <div style={{ display: 'flex', flexDirection: "column", position: 'relative', boxSize: 'border-box', padding: 5, paddingTop: 0, paddingBottom: 0, height: '100%' }}>
        <Descriptions bordered>
          <Descriptions.Item label="项目名称" span={24}>{this.state.projectName || '无'}</Descriptions.Item>
          <Descriptions.Item label="事件名称" span={24}>{this.state.eventName || '无'}</Descriptions.Item>
          <Descriptions.Item label="计划开始时间" span={24}>{this.state.planStartTime || '无'}</Descriptions.Item>
          <Descriptions.Item label="计划结束时间" span={24}>{this.state.planEndTime || '无'}</Descriptions.Item>
          <Descriptions.Item label="计划工期" span={24}>{this.state.workTime || '无'}</Descriptions.Item>
          <Descriptions.Item label="实际开始时间" span={24}>{this.state.actualStartTime || '无'}</Descriptions.Item>
          {system.remindType == 1 && this.getSjkssj(SubeventsInfoData)}
          <Descriptions.Item label="实际结束时间" span={24}>{this.state.actualEndTime || '无'}</Descriptions.Item>
          <Descriptions.Item label="实际工期" span={24}>{this.state.practicalWorkTime || '无'}</Descriptions.Item>
          <Descriptions.Item label="事件详情" span={24}>
            <Button onClick={this.onsubeventsInfo}> <IconFont type="icon-gantetu" style={{ fontSize: 20 }} /> 打开事件详情</Button>
          </Descriptions.Item>
          {system.remindType == 1 && this.getYqly(SubeventsInfoData)}

        </Descriptions>

        {system.haveRead != 1 && system.remindType == 1 && <div className={styles['bottomBtn']}>
          <Spin spinning={this.state.loading} >
            <div className={styles['Btn']} onClick={this.onSave}>保存</div>
          </Spin>
        </div>}

        {
          this.state.SubeventsInfoVisible && <SubeventsInfo
            onCancel={this.ModalCancel.bind(this, 'SubeventsInfoVisible')}
            SubeventsInfoData={this.state.SubeventsInfoData}
            visible={this.state.SubeventsInfoVisible}
          />
        }
      </div>
    );


  }
}
export default Form.create()(Tab5_sub);


